-
Notifications
You must be signed in to change notification settings - Fork 253
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
chore(kitchen-sink): update dependencies and fix a key issue in the todo list #136
chore(kitchen-sink): update dependencies and fix a key issue in the todo list #136
Conversation
@theborowski is attempting to deploy a commit to the Million Team on Vercel. A member of the Team first needs to authorize it. |
packages/kitchen-sink/src/index.jsx
Outdated
{tasks.map((task) => ( | ||
<TaskItem key={task} task={task} onDelete={onDelete} /> | ||
{tasks.map((task, i) => ( | ||
<TaskItem key={`${task}_${i}`} task={task} onDelete={onDelete} /> |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
honestly this is the same even if we remove the key
prop. Needs an alternative "id generation"
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Do you think just using a timestamp here as an "id" is sufficient?
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
we need something like
interface Task {
id: string;
text: string;
}
and then use id
as the key.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
I refactored this to use an object as you suggested. This fixes the key
problem as well as improves deletion with using the id
of the task. I also moved the task creation in a function so that clicking and pressing enter have the same behavior. Added a little clip of the app working with these changes in the PR description.
7526d13
to
47c46ca
Compare
174c4b2
to
9f67524
Compare
…improves key tracking and deletions
9f67524
to
88c13db
Compare
@lxsmnsyc are there any additional changes needed in order to get this merged in? |
Nothing specifically. LGTM |
commit: |
changes
react
andreact-dom
from the RC version to the official19.0.0
releasebabel-plugin-react-compiler
dependencyvite
related dependencies intodevDependencies
visual diff
Screen.Recording.2024-12-17.at.8.09.28.PM.mov